<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('数据统计')"/>
    <th:block th:include="include :: footer"/>
</head>
<style>
    .data-table {
        border-collapse: collapse;
        width: 100%;
        margin: 20px 0;
        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
    }
    .data-table th {
        background-color: #9a9a9a;
        color: white;
        padding: 2px;
        text-align: left;
    }
    .data-table td {
        padding: 10px;
        border-bottom: 1px solid #ddd;
    }
    .data-table tr:hover {
        background-color: #f5f5f5;
    }
    .error {
        color: #d32f2f;
        font-weight: bold;
    }
    .time-col {
        min-width: 130px;
    }
    .time-col1{
        width: 278px;
    }
    .container {
        height: 45%;
        width: 100%;
        display: flex; /* 设置为flex容器 */
    }

    /* 若要让子元素等分父容器的宽度，则添加以下属性 */
    .container > div {
        flex-grow: 1; /* 每个子元素都会自动伸展并均分剩余空间 */
    }

    .xdiv {
        width: 100%;
        height: 9%;
    }

    .ztjz {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100%;
        font-size: 77px;
    }
   /* .hover-border {
        border: 2px solid transparent;
        transition: border-color 0.3s, box-shadow 0.3s;
    }*/

    .hover-border {
        border-color: rgba(93, 175, 52, 0);
        box-shadow: 0 8px 15px rgba(93, 175, 52, 0.64);
    }
    .hover-borderh {
        border-color: rgba(93, 175, 52, 0);
        box-shadow: 0 8px 15px rgba(154, 154, 154, 0.71);
    }
    .bootstrap-table .fixed-table-toolbar .columns-right {
        display: none!important;
        margin-left: 5px;
    }
    .bootstrap-table .fixed-table-pagination>.pagination-detail .page-list {
        display: none!important;
    }
    .bootstrap-table .fixed-table-pagination>.pagination, .bootstrap-table .fixed-table-pagination>.pagination-detail {
        width: 50%!important;
        margin-top: 10px;
        margin-bottom: 10px;
</style>
<body>
<div class="container" style="height: 22%;">
    <div class="hover-border" style="height: 100%;width: 13%;background-color: #f5f5f5;margin: 10px;border-radius: 5px;">
        <div class="xdiv" style="background-color: #5daf34;border-radius: 5px;height: 17%;margin-top: 1%">
            <div style="float: left;">
                <span style="color: #fffbe6;font-size: 16px;">&nbsp;&nbsp;入库个数</span>
            </div>
            <div style="float: right;margin-top: 2px">
                <button id="dt" onclick="rkgs(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dy" onclick="rkgs(2)">当月</button>
                <button id="dn" onclick="rkgs(3)">当年</button>
            </div>
        </div>
        <div style="margin-top: 10%">
            <span id="cg" class="ztjz" style="font-size: 60px;color: #5daf34"></span>
        </div>
    </div>
    <div class="hover-border" style="height: 100%;width: 13%;background-color: #f5f5f5;    margin: 10px;border-radius: 5px;">
        <div class="xdiv" style="background-color: #5daf34;border-radius: 5px;height: 17%;">
            <div style="float: left;margin-top: 6px;">
                <span style="color: #fffbe6;font-size: 16px;">&nbsp;&nbsp;入库量</span>
            </div>
            <!--<div style="float: right;margin-top: 2px">
                <button id="dtsbsj" onclick="rkgs(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dysb" onclick="rkgs(2)">当月</button>
                <button id="dnsb" onclick="rkgs(3)">当年</button>&nbsp;&nbsp;
            </div>-->
        </div>
        <div style="margin-top: 10%">
            <span id="rkl" class="ztjz" style="font-size: 60px;color: #5daf34"></span>
        </div>

    </div>
    <div class="hover-border" style="height: 100%;width: 13%;background-color: #f5f5f5;    margin: 10px;border-radius: 5px;">
        <div class="xdiv" style="background-color: #5daf34;border-radius: 5px;height: 17%;">
            <div style="float: left;margin-top: 6px;">
                <span style="color: #fffbe6;font-size: 16px;">&nbsp;&nbsp;推送个数</span>
            </div>
            <div style="float: right;margin-top: 2px">
                <button id="dtcssj" onclick="tsgs(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dycs" onclick="tsgs(2)">当月</button>
                <button id="dncs" onclick="tsgs(3)">当年</button>&nbsp;&nbsp;
            </div>
        </div>
        <div style="margin-top: 10%">
            <span id="ts" class="ztjz" style="font-size: 60px;color: #5daf34"></span>
        </div>
    </div>
    <div class="hover-border" style="height: 100%;width: 13%;background-color: #f5f5f5;    margin: 10px;border-radius: 5px;">
        <div class="xdiv" style="background-color: #5daf34;border-radius: 5px;height: 17%;">
            <div style="float: left;margin-top: 6px;">
                <span style="color: #fffbe6;font-size: 16px;">&nbsp;&nbsp;推送量</span>
            </div>
            <!--<div style="float: right;margin-top: 2px">
                <button id="dtcssjc" onclick="dtcssj()" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dycsc" onclick="dycs()">当月</button>
                <button id="dncsc" onclick="dncs()">当年</button>&nbsp;&nbsp;
            </div>-->
        </div>
        <div style="margin-top: 10%">
        <span id="tsl" class="ztjz" style="font-size: 60px;color: #5daf34"></span>
        </div>
    </div>
</div>
<div class="container" style="height: 70%;    margin-top: 1%;">
    <div class="hover-borderh" style="height: 100%;width: 13%;background-color: #f5f5f5;margin: 10px;border-radius: 5px;">
        <div class="xdiv" style="background-color: #9a9a9a;border-radius: 5px;height: 5%">
            <div style="float: left;margin-top: 6px">
                <span style="color: #fffbe6;font-size: 16px">&nbsp;&nbsp;入库失败个数</span>
            </div>
            <div style="float: right;margin-top: 2px">
                <button id="dt1" onclick="rksbgs(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dy1" onclick="rksbgs(2)">当月</button>
                <button id="dn1" onclick="rksbgs(3)">当年</button>
            </div>
        </div>
        <div style="margin-top: 1%">
            <span id="cg1" class="ztjz" style="font-size: 60px;color: rgb(154,154,154)"></span>
        </div>
        <div id="rksb" style="width: 100%;height: 80%;margin-top: -4%; overflow-y: auto; /* 自动显示垂直滚动条 */border: 1px solid #ddd;">
            <table id="bootstrap-tablesb"></table>
        </div>

    </div>
    <div class="hover-borderh" style="height: 100%;width: 13%;background-color: #f5f5f5;    margin: 10px;border-radius: 5px;">
        <div  class="xdiv" style="background-color: #9a9a9a;border-radius: 5px;height: 5%">
            <div style="float: left;margin-top: 6px">
                <span style="color: #fffbe6;font-size: 16px">&nbsp;&nbsp;晚传个数</span>
            </div>
            <div style="float: right;margin-top: 2px">
                <button id="dtsbsj2" onclick="wcsbsj(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dysb2" onclick="wcsbsj(2)">当月</button>
                <button id="dnsb2" onclick="wcsbsj(3)">当年</button>&nbsp;&nbsp;
            </div>
        </div>
        <div style="margin-top: 1%">
        <span id="sb2" class="ztjz" style="font-size: 60px;color: rgb(154,154,154)"></span>
        </div>
        <div id="rksb1" style="width: 100%;height: 100%;margin-top: -4%;">
            <table id="wcbootstrap-table"></table>
        </div>
    </div>
    <div class="hover-borderh" style="height: 100%;width: 13%;background-color: #f5f5f5;    margin: 10px;border-radius: 5px;">
        <div  class="xdiv" style="background-color: #9a9a9a;border-radius: 5px;height: 5%">
            <div style="float: left;margin-top: 6px">
                <span style="color: #fffbe6;font-size: 16px">&nbsp;&nbsp;推送失败个数</span>
            </div>
            <div style="float: right;margin-top: 2px">
                <button id="dtcssj3" onclick="tssbsj(1)" style="background-color: #17b3a3;border: 0px">当天</button>
                <button id="dycs3" onclick="tssbsj(2)">当月</button>
                <button id="dncs3" onclick="tssbsj(3)">当年</button>&nbsp;&nbsp;
            </div>
        </div>
        <div style="margin-top: 1%">
            <span id="cs3" class="ztjz" style="font-size: 60px;color: #9a9a9a"></span>
        </div>
        <div id="rksb2" style="width: 100%;height: 78%;margin-top: -4%;overflow-y: auto;">
            <table id="tssbbootstrap-table"></table>
        </div>
    </div>
</div>
</body>
<script>
    var timetyperksbbg = 1;
    var timetypetwc = 1;
    var timetypetssbbg = 1;
    const currentDate = new Date();
    const year = currentDate.getFullYear();
    const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
    const day = currentDate.getDate();
    var prefix = ctx + "statistics";
    //初始化
    var time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
    rkgshrkl(time);//入库
    tsgshtsl(time);//推送
    rksbsl(time);//失败
    wcsbsl(time)//晚传
    tssbsbsl(time)//推送失败
    /**
     * 入库个数和入库量
     * @param e
     * @returns {*|string}
     */
    function rkgshrkl(time){
        $.ajax({
            url:prefix + "/cgdata",
            data:{time:time},
            type:"Post",
            success:function (e) {
                console.log(e)
                $("#cg").text(e.zs)//成功赋值
                if(e.size < 1024.0){
                    $("#rkl").text(e.size.toFixed(2)+"Mb")//成功赋值
                }else{
                    $("#rkl").text(convertMBtoGB(e.size))//成功赋值
                }


            }
        })
    }

    /**
     * 推送个数和推送量
     */
    function tsgshtsl(time){
        $.ajax({
            url:prefix + "/tsdata",
            data:{time:time},
            type:"Post",
            success:function (e) {
                console.log(e)
                $("#ts").text(e.zs)//推送赋值
                if(e.size < 1024.0){
                    $("#tsl").text(e.size.toFixed(2)+"Mb")//推送赋值
                }else{
                    $("#tsl").text(convertMBtoGB(e.size))//推送赋值
                }


            }
        })
    }

    /**
     * 入库失败数
     * @param time
     */
    function rksbsl(time){
        $.ajax({
            url:prefix + "/sbdata",
            data:{time:time},
            type:"Post",
            success:function (e) {
                console.log(e)
                $("#cg1").text(e.zs)//成功赋值
                //sbsxtrk()
                generateDataTable(e.size)
            }
        })
    }
    // 入库失败表格生成函数
    function generateDataTable(data) {
        // 创建表格结构
        const $table = $('<table>').addClass('data-table');
        const $thead = $('<thead>').appendTo($table);
        const $tbody = $('<tbody>').appendTo($table);

        // 创建表头
        $thead.append(
            $('<tr>').append(
                $('<th style="width: 80px">').text('时间'),
                $('<th style="width: 450px">').text('日志内容')
            )
        );

        // 循环处理数据
        $.each(data, function(index, item) {
            const $row = $('<tr>').append(
                // 转换时间格式
                $('<td>').addClass('time-col')
                    .text(new Date(item.operatetime).toLocaleString()),
                // 处理长文本
                $('<td>').html(`<span title="${item.logcontent}">${item.logcontent}</span>`
                    /* item.logcontent.length > 50 ?
                         `<span title="${item.logcontent}">${item.logcontent.substring(0, 47)}...</span>` :
                         item.logcontent*/
                )
            );
            $tbody.append($row);
        });

        // 插入到页面
        $('#bootstrap-tablesb').empty().append($table);
    }


    /**
     * 晚传数
     * @param time
     */
    function wcsbsl(time){
        $.ajax({
            url:prefix + "/wcdata",
            data:{time:time},
            type:"Post",
            success:function (e) {
                console.log(e)
                $("#sb2").text(e.size)//成功赋值
                generateDataTable3(e.list)
                //wcsxt()
            }
        })
    }

    /**
     * 晚传表格
     * @param data
     */
    function generateDataTable3(data) {
        // 创建表格结构
        const $table = $('<table>').addClass('data-table');
        const $thead = $('<thead>').appendTo($table);
        const $tbody = $('<tbody>').appendTo($table);

        // 创建表头
        $thead.append(
            $('<tr>').append(
                $('<th style="width: 400px">').text('文件名'),
                $('<th style="width: 130px">').text('时间')
            )
        );

        // 循环处理数据
        $.each(data, function(index, item) {
            const $row = $('<tr>').append(
                /*  // 转换时间格式
                  $('<td>').addClass('time-col')
                      .text(item.resourcePath),*/
                $('<td>').html(
                    `<span title="${item.productName}">${item.productName}</span>`
                   /* item.productName.length > 20 ?
                        `<span title="${item.productName}">${item.productName.substring(0, 17)}...</span>` :
                        item.productName*/
                ),
                // 处理长文本
             /*   $('<td>').addClass('time-col1').html(
                    `<span title="${item.cause}">${item.cause}</span>`
                ),*/
                // 转换时间格式
                $('<td>').addClass('time-col')
                    .text(new Date(item.createDate
                    ).toLocaleString()),
            );
            $tbody.append($row);
        });

        // 插入到页面
        $('#wcbootstrap-table').empty().append($table);
    }
    /**
     * 推送失败量
     * @param time
     */
    function tssbsbsl(time){
        $.ajax({
            url:prefix + "/tssbdata",
            data:{time:time},
            type:"Post",
            success:function (e) {
                console.log(e)
                $("#cs3").text(e.size)//成功赋值
                generateDataTable1(e.list)
            }
        })
    }
    // 推送失败表格生成函数
    function generateDataTable1(data) {
        // 创建表格结构
        const $table = $('<table>').addClass('data-table');
        const $thead = $('<thead>').appendTo($table);
        const $tbody = $('<tbody>').appendTo($table);

        // 创建表头
        $thead.append(
            $('<tr>').append(
                $('<th style="width: 80px">').text('文件'),
                $('<th style="width: 350px">').text('失败原因'),
                $('<th style="width: 100px">').text('时间')
            )
        );

        // 循环处理数据
        $.each(data, function(index, item) {
            var name = item.resourcePath.split('/');
            const $row = $('<tr>').append(
              /*  // 转换时间格式
                $('<td>').addClass('time-col')
                    .text(item.resourcePath),*/
                $('<td>').html(`<span title="${item.resourcePath}">`+name[name.length - 1]+`</span>`
                   /* item.resourcePath.length > 20 ?
                        `<span title="${item.resourcePath}">${item.resourcePath.substring(0, 17)}...</span>` :
                        item.resourcePath*/
                ),
                // 处理长文本
                $('<td>').addClass('time-col1').html(
                        `<span title="${item.cause}">${item.cause}</span>`
                ),
                // 转换时间格式
                $('<td>').addClass('time-col')
                    .text(new Date(item.createDate
                    ).toLocaleString()),
            );
            $tbody.append($row);
        });

        // 插入到页面
        $('#tssbbootstrap-table').empty().append($table);
    }
    function sjcl(e) {
        if (e.length < 2) {
            return "0" + e;
        } else {
            return e;
        }
    }

    /**
     * M转G
     * @param mb
     * @returns {string}
     */
    function convertMBtoGB(mb) {
        if (typeof mb !== 'number' || isNaN(mb)) return 'Invalid input';
        const gb = mb / 1024;
        return gb.toFixed(2) + ' GB'; // 转换为字符串并补零（如 2.5 → "2.50"）
    }


    function tssbsxt(){
        var options = {
            id:"tssbbootstrap-table",
            url: prefix + "/tssblist",
            modalName: "推送失败",
            height:450,
            columns: [
                {
                    field: 'resourcePath',
                    title: '文件'
                },
                {
                    field: 'cause',
                    title: '失败文件原因'
                },
                {
                    field: 'createDate',
                    title: '时间',
                    formatter: function (value, row, index) {
                        const dateObj = new Date(value);

                        const year = dateObj.getFullYear();
                        const month = dateObj.getMonth() + 1;
                        const day = dateObj.getDate();
                        const hours = dateObj.getHours();
                        const minutes = dateObj.getMinutes();
                        const seconds = dateObj.getSeconds();

                        return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
                    }
                }
            ]
        };
        $.table.init(options);
    }
/*    function sbsxtrk(){
        console.log("调用失败表格")
        var options = {
            id:"bootstrap-tablesb",
            url: prefix + "/sbdatasj",
            modalName: "入库失败",
            queryParams:queryParams,
            height:450,
            columns: [
                {
                    field: 'logcontent',
                    title: '失败文件原因'
                },
                {
                    field: 'operatetime',
                    title: '时间',
                    formatter: function (value, row, index) {
                        const dateObj = new Date(value);

                        const year = dateObj.getFullYear();
                        const month = dateObj.getMonth() + 1;
                        const day = dateObj.getDate();
                        const hours = dateObj.getHours();
                        const minutes = dateObj.getMinutes();
                        const seconds = dateObj.getSeconds();

                        return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
                    }
                }
                ]
        };
        $.table.init(options);
    }*/
    function queryParams(params) {
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetyperksbbg)
        //初始化
        var time = "";
        if(timetyperksbbg==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
        }
        if(timetyperksbbg==2){//d当月
            time = year + "-" + sjcl(month.toString())
        }
        if(timetyperksbbg==3){//d当年
            time = year
        }
        console.log("创建了参数"+time)
        var search = $.table.queryParams(params);
        search.time = time;
        return search;
    }
    function wcsxt(){
        var options = {
            id:"wcbootstrap-table",
            url: prefix + "/wcdatasj",
            modalName: "入库失败",
            height:450,
            columns: [
                {
                    field: 'productName',
                    title: '文件名'
                },
                {
                    field: 'createDate',
                    title: '时间',
                    formatter: function (value, row, index) {
                        const dateObj = new Date(value);

                        const year = dateObj.getFullYear();
                        const month = dateObj.getMonth() + 1;
                        const day = dateObj.getDate();
                        const hours = dateObj.getHours();
                        const minutes = dateObj.getMinutes();
                        const seconds = dateObj.getSeconds();

                        return year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds;
                    }
                }
            ]
        };
        $.table.init(options);
    }

    /**
     * 推送个数上的时间按钮
     * @param timetype
     */
    function tsgs(timetype){
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetype)
        //初始化
        var time = "";
        if(timetype==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
            $("#dtcssj").css("background-color","#17b3a3");
            $("#dycs").css("background-color","#ffffff");
            $("#dncs").css("background-color","#ffffff");
        }
        if(timetype==2){//d当月
            $("#dycs").css("background-color","#17b3a3");
            $("#dtcssj").css("background-color","#ffffff");
            $("#dncs").css("background-color","#fdfdfd");
            time = year + "-" + sjcl(month.toString())
        }
        if(timetype==3){//d当年
            $("#dncs").css("background-color","#17b3a3");
            $("#dycs").css("background-color","#ffffff");
            $("#dtcssj").css("background-color","#ffffff");
            time = year
        }
        tsgshtsl(time)
    }
    /**
     * 入库个数上面的时间按钮
     * @param time
     */
    function rkgs(timetype){
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetype)
        //初始化
        var time = "";
        if(timetype==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
            $("#dt").css("background-color","#17b3a3");
            $("#dy").css("background-color","#ffffff");
            $("#dn").css("background-color","#ffffff");
        }
        if(timetype==2){//d当月
            $("#dy").css("background-color","#17b3a3");
            $("#dt").css("background-color","#ffffff");
            $("#dn").css("background-color","#fdfdfd");
            time = year + "-" + sjcl(month.toString())
        }
        if(timetype==3){//d当年
            $("#dn").css("background-color","#17b3a3");
            $("#dy").css("background-color","#ffffff");
            $("#dt").css("background-color","#ffffff");
            time = year
        }
        rkgshrkl(time)
    }

    /**
     * 入库失败个数上面的三个按钮
     * @param timetype
     */
    function rksbgs(timetype){
        timetyperksbbg = timetype;
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetype)
        //初始化
        var time = "";
        if(timetype==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
            $("#dt1").css("background-color","#17b3a3");
            $("#dy1").css("background-color","#ffffff");
            $("#dn1").css("background-color","#ffffff");
        }
        if(timetype==2){//d当月
            $("#dy1").css("background-color","#17b3a3");
            $("#dt1").css("background-color","#ffffff");
            $("#dn1").css("background-color","#fdfdfd");
            time = year + "-" + sjcl(month.toString())
        }
        if(timetype==3){//d当年
            $("#dn1").css("background-color","#17b3a3");
            $("#dy1").css("background-color","#ffffff");
            $("#dt1").css("background-color","#ffffff");
            time = year
        }
        rksbsl(time)

    }

    /**
     * 推送失败上面三个按钮
     * @param timetype
     */
    function tssbsj(timetype){
        timetypetssbbg = timetype;
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetype)
        //初始化
        var time = "";
        if(timetype==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
            $("#dtcssj3").css("background-color","#17b3a3");
            $("#dycs3").css("background-color","#ffffff");
            $("#dncs3").css("background-color","#ffffff");
        }
        if(timetype==2){//d当月
            $("#dycs3").css("background-color","#17b3a3");
            $("#dtcssj3").css("background-color","#ffffff");
            $("#dncs3").css("background-color","#fdfdfd");
            time = year + "-" + sjcl(month.toString())
        }
        if(timetype==3){//d当年
            $("#dncs3").css("background-color","#17b3a3");
            $("#dycs3").css("background-color","#ffffff");
            $("#dtcssj3").css("background-color","#ffffff");
            time = year
        }
        tssbsbsl(time)
    }

    /**
     * 晚传
     * @param timetype
     */
    function wcsbsj(timetype){
        timetypetwc = timetype;
        const currentDate = new Date();
        const year = currentDate.getFullYear();
        const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
        const day = currentDate.getDate();
        console.log(timetype)
        //初始化
        var time = "";
        if(timetype==1){//d当天
            time = year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())
            $("#dtsbsj2").css("background-color","#17b3a3");
            $("#dysb2").css("background-color","#ffffff");
            $("#dnsb2").css("background-color","#ffffff");
        }
        if(timetype==2){//d当月
            $("#dysb2").css("background-color","#17b3a3");
            $("#dtsbsj2").css("background-color","#ffffff");
            $("#dnsb2").css("background-color","#fdfdfd");
            time = year + "-" + sjcl(month.toString())
        }
        if(timetype==3){//d当年
            $("#dnsb2").css("background-color","#17b3a3");
            $("#dysb2").css("background-color","#ffffff");
            $("#dtsbsj2").css("background-color","#ffffff");
            time = year
        }
        wcsbsl(time)
    }
</script>
<!--<script>
    var prefix = ctx + "statistics";
    /**
     * 当天
     * @type {number}
     */
    var dtcg = 0;//当天成功
    var dtsb = 0;//当天失败
    var dtcs = 0;//当天超时

    const currentDate = new Date();
    const year = currentDate.getFullYear();
    const month = currentDate.getMonth() + 1; // 月份从0开始，需要加1
    const day = currentDate.getDate();
    //csh();//初始化页面
    /**
     * 进入页面展示
     */
    function csh(){
        $.ajax({
            url:prefix + "/lists",
            data:{time:year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())},
            type:"Post",
            success:function (e) {
                //console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cg").text(cg)
                $("#sb").text(sb)
                $("#cs").text(cs)
                tjt(x,normalUpload,lateUpload,leakUpload);
            }
        })
    }
    /**
     * 成功当天
     */
    function dt() {
        $("#dy").css("background-color","#ffffff")
        $("#dn").css("background-color","#ffffff")
        $("#dt").css("background-color","#17b3a3")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())},
            type: "Post",
            success: function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cg").text(cg)
                /* $("#sb").text(sb)
                $("#cs").text(cs)
                tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }
    /**
     * 成功当月
     */
    function dy(){
        $("#dt").css("background-color","#ffffff")
        $("#dn").css("background-color","#ffffff")
        $("#dy").css("background-color","#17b3a3")
        $.ajax({
            url:prefix + "/lists",
            data:{time:year + "-" + sjcl(month.toString())},
            type:"Post",
            success:function (e) {
                //console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    sb = (sb+Number(e[i].lateUpload));  //晚传
                    cs = (cs+Number(e[i].leakUpload));  //异常
                    bc = (bc+Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cg").text(cg)
                /* $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }

    /**
     * 成功当年
     */
    function dn(){
        $("#dy").css("background-color","#ffffff")
        $("#dt").css("background-color","#ffffff")
        $("#dn").css("background-color","#17b3a3")
        $.ajax({
            url:prefix + "/lists",
            data:{time:year},
            type:"Post",
            success:function (e) {
              //  console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    sb = (sb+Number(e[i].lateUpload));  //晚传
                    cs = (cs+Number(e[i].leakUpload));  //异常
                    bc = (bc+Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cg").text(cg)
                /* $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }




    /**
     * 失败当月
     */
    function dysb() {
        $("#dysb").css("background-color","#17b3a3")
        $("#dtsbsj").css("background-color","#ffffff")
        $("#dnsb").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year + "-" + sjcl(month.toString())},
            type: "Post",
            success: function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#sb").text(sb)
                /*$("#cg").text(cg)
                 $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }

    /**
     * 失败当年
     */
    function dnsb() {
        $("#dnsb").css("background-color","#17b3a3")
        $("#dtsbsj").css("background-color","#ffffff")
        $("#dysb").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year},
            type: "Post",
            success: function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#sb").text(sb)
                /*$("#cg").text(cg)
                 $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }
    /**
     * 失败当天
     */
    function dtsbsj() {
        $("#dtsbsj").css("background-color","#17b3a3")
        $("#dysb").css("background-color","#ffffff")
        $("#dnsb").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())},
            type: "Post",
            success: function (e) {
                //console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#sb").text(sb)
                /* $("#sb").text(sb)
                $("#cs").text(cs)
                tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }


    /**
     * 超时当天
     */
    function dtcssj() {
        $("#dtcssj").css("background-color","#17b3a3")
        $("#dycs").css("background-color","#ffffff")
        $("#dncs").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())},
            type: "Post",
            success: function (e) {
                //console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cs").text(cs)
                /* $("#sb").text(sb)
                $("#cs").text(cs)
                tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }

    /**
     * 超时当月
     */
    function dycs() {
        $("#dycs").css("background-color","#17b3a3")
        $("#dtcssj").css("background-color","#ffffff")
        $("#dncs").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year + "-" + sjcl(month.toString())},
            type: "Post",
            success: function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cs").text(cs)
                /*$("#cg").text(cg)
                 $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }

    /**
     * 超时当天
     */
    function dncs() {
        $("#dncs").css("background-color","#17b3a3")
        $("#dtcssj").css("background-color","#ffffff")
        $("#dycs").css("background-color","#ffffff")
        $.ajax({
            url: prefix + "/lists",
            data: {time: year},
            type: "Post",
            success: function (e) {
                //console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg + Number(e[i].normalUpload));  //正常
                    sb = (sb + Number(e[i].lateUpload));  //晚传
                    cs = (cs + Number(e[i].leakUpload));  //异常
                    bc = (bc + Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                dtcg = cg;
                dtsb = sb;
                dtcs = cs;
                $("#cs").text(cs)
                /*$("#cg").text(cg)
                 $("#sb").text(sb)
                 $("#cs").text(cs)
                 tjt(x,normalUpload,lateUpload,leakUpload);*/
            }
        })
    }

    /**
     * 统计当天
     */
    function tjdt(){
        $("#tjdt").css("background-color","#17b3a3")
        $("#tjdy").css("background-color","#ffffff")
        $("#tjdn").css("background-color","#ffffff")
        $.ajax({
            url:prefix + "/lists",
            data:{time:year + "-" + sjcl(month.toString()) + "-" + sjcl(day.toString())},
            type:"Post",
            success:function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    sb = (sb+Number(e[i].lateUpload));  //晚传
                    cs = (cs+Number(e[i].leakUpload));  //异常
                    bc = (bc+Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                tjt(x,normalUpload,lateUpload,leakUpload);
            }
        })
    }

    /**
     * 统计当月
     */
    function tjdy(){
        $("#tjdy").css("background-color","#17b3a3")
        $("#tjdt").css("background-color","#ffffff")
        $("#tjdn").css("background-color","#ffffff")
        $.ajax({
            url:prefix + "/lists",
            data:{time:year + "-" + sjcl(month.toString())},
            type:"Post",
            success:function (e) {
              //  console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    sb = (sb+Number(e[i].lateUpload));  //晚传
                    cs = (cs+Number(e[i].leakUpload));  //异常
                    bc = (bc+Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                tjt(x,normalUpload,lateUpload,leakUpload);
            }
        })
    }

    /**
     * 统计当年
     */
    function tjdn(){
        $("#tjdn").css("background-color","#17b3a3")
        $("#tjdy").css("background-color","#ffffff")
        $("#tjdt").css("background-color","#ffffff")
        $.ajax({
            url:prefix + "/lists",
            data:{time:year},
            type:"Post",
            success:function (e) {
               // console.log(e);
                var cg = 0;//正常
                var sb = 0;//晚传
                var cs = 0;//异常
                var bc = 0;//补传
                var x = []
                var normalUpload = [] //正常
                var lateUpload = [] //失败
                var leakUpload = []//超时
                for (let i = 0; i < e.length; i++) {
                    cg = (cg+Number(e[i].normalUpload));  //正常
                    sb = (sb+Number(e[i].lateUpload));  //晚传
                    cs = (cs+Number(e[i].leakUpload));  //异常
                    bc = (bc+Number(e[i].repairUpload)); //补传
                    x.push(e[i].productName)
                    normalUpload.push(Number(e[i].normalUpload))
                    lateUpload.push(Number(e[i].lateUpload))
                    leakUpload.push(Number(e[i].leakUpload))
                }
                tjt(x,normalUpload,lateUpload,leakUpload);
            }
        })
    }
    function sjcl(e) {
        if (e.length < 2) {
            return "0" + e;
        } else {
            return e;
        }
    }
</script>
<script>
    function tjt(x,normalUpload,lateUpload,leakUpload) {
        var chartDom = document.getElementById('main');
        var myChart = echarts.init(chartDom);
        var option;

        option = {
            title: {
                text: '产品入库统计',
            },
            tooltip: {
                trigger: 'axis'
            },
            legend: {
                data: ['正常', '失败',"超时"]
            },
            toolbox: {
                show: true,
                feature: {
                    dataView: { show: true, readOnly: false },
                    magicType: { show: true, type: ['line', 'bar'] },
                    restore: { show: true },
                    saveAsImage: { show: true }
                }
            },
            calculable: true,
            xAxis: [
                {
                    type: 'category',
                    // prettier-ignore
                    data: x,
                    axisLabel: {
                        rotate: -20 // 逆时针旋转-90度使其竖向显示
                    }
                }
            ],
            yAxis: [
                {
                    type: 'value'
                }
            ],
            series: [
                {
                    name: '正常',
                    type: 'bar',
                    itemStyle: {
                        color: '#5daf34'   // 这里设置为红色
                    },
                    data: normalUpload,
                    markPoint: {
                        data: [
                            {type: 'max', name: 'Max'},
                            {type: 'min', name: 'Min'}
                        ]
                    },
                    markLine: {
                        data: [{type: 'average', name: 'Avg'}]
                    }
                },
                {
                    name: '失败',
                    type: 'bar',
                    itemStyle: {
                        color: '#f56c6c'   // 这里设置为红色
                    },
                    data: lateUpload,
                    markPoint: {
                        data: [
                            {name: 'Max', value: 182.2, xAxis: 7, yAxis: 183},
                            {name: 'Min', value: 2.3, xAxis: 11, yAxis: 3}
                        ]
                    },
                    markLine: {
                        data: [{type: 'average', name: 'Avg'}]
                    }
                },
                {
                    name: '超时',
                    type: 'bar',
                    itemStyle: {
                        color: '#e6a23c'   // 这里设置为红色
                    },
                    data: leakUpload,
                    markPoint: {
                        data: [
                            {name: 'Max', value: 182.2, xAxis: 7, yAxis: 183},
                            {name: 'Min', value: 2.3, xAxis: 11, yAxis: 3}
                        ]
                    },
                    markLine: {
                        data: [{type: 'average', name: 'Avg'}]
                    }
                }
            ]
        };

        option && myChart.setOption(option);
    }
</script>-->
</html>